<template>
    <div id="img-insert">
        <div class="title">
            通过URL添加图片数据
        </div>
        <div class="mainInput">
            <div class="input">
                <el-input v-model="url" placeholder="请输入URL"></el-input>
            </div>
             <div class="input">
                <el-input type="number" v-model.trim="start" placeholder="请输入启始PID"></el-input>
            </div>
             <div class="input">
                <el-input type="number" v-model.trim="ending" placeholder="请输入末尾PID"></el-input>
            </div>
            <div class="input">
                 <el-button @click="SubmitURL" class="button" string="medium" type="primary">确认</el-button>
            </div>


        </div>
    </div>
</template>

<script>
import {InsertImg,List} from "../api/Pictures.js"
 
export default {
    name:"mainInput",
    data(){
        return{
            url:"",
            start:"",
            ending:""
        }
    },
   methods: {
     async  SubmitURL () {
        //     let {data}= await  InsertImg({
        //        URL:this.url,
        //        start:this.start,
        //        ending:this.ending
        //    })

           let {data}=await List()
           console.log(data);
          
       },
   },

}
</script>

<style scoped>
    #img-insert{
        width: 100%;
        height: 100%;
        background: url('../assets/img/lp.jpg');
        background-size: 100% 100%;
    }
    .title{
        color: #000;
        font-size: 25px;
        width: 100%;
        height: 20vh;
        font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
        text-align: center;
        line-height: 20vh;
    }
    .mainInput{
        width: 100vw;
        height: 50vh;
    }
    .input{
        margin: 0 15px 30px;
        text-align: center;
    }
    .button{
        background: rgb(18, 167, 226);
    }
</style>